//定义懒加载插件
import {useIntersectionObserver} from "@vueuse/core";

export const lazyPlugins={
    install(app){
        app.directive('img-lazy',{
            mounted(el,binding){
                // console.log(el,binding.value) 输出的是图片信息
                const {stop}=useIntersectionObserver(
                    el,
                    ([{isIntersecting}])=>{
                        // console.log(isIntersecting)
                        if(isIntersecting){
                            //进入视口区域，加载图片
                            el.src=binding.value
                            //懒加载图片后停止监视
                            stop()
                        }
                    }
                )
            }
        })
    }
}